<!DOCTYPE html>
<html
        xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" xmlns:th="http://www.thymeleaf.org"
        layout:decorate="~{base/layout}">

<div layout:fragment="content">
    <!--med_tittle_section-->
    <div class="med_tittle_section">
        <div class="med_img_overlay"></div>
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="med_tittle_cont_wrapper">
                        <div class="med_tittle_cont">
                            <ol class="breadcrumb">
                                <li><a th:href="@{/}">智慧党建</a></li>
                                <li><a th:href="@{/party/committeeUI}" th:text="${activeTab}"></a></li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="page-container">
        <div class="container">
            <div class="row med_toppadder50">
                <!--                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">-->
                <div class="col-lg-9 col-md-9 col-sm-8 col-xs-12">
                    <div class="filter-type-box cy-tabs">
                        <ul class="nav nav-tabs mb-10">
                            <li th:class="${activeTab=='党务管理'?'active':''}">
                                <a th:href="@{/party/committeeUI}"><i class="fa"></i>党务管理</a>
                            </li>
                            <li th:class="${activeTab=='党员活动'?'active':''}">
                                <a th:href="@{/party/activitiesUI(contentType='党员活动')}"><i class="fa"></i>党员活动</a>
                            </li>
                            <li th:class="${activeTab=='党建动态'?'active':''}">
                                <a th:href="@{/party/activitiesUI(contentType='党建动态')}"><i class="fa"></i>党建动态</a>
                            </li>
                            <li th:class="${activeTab=='三会一课'?'active':''}">
                                <a th:href="@{/party/activitiesUI(contentType='三会一课')}"><i class="fa"></i>三会一课</a>
                            </li>
                            <li>

                            </li>

                            <li class="pull-right">
                                <div class="search-tags">
                                    <form th:action="@{/party/committeeUI}" methed="post" name="search-form"
                                          id="search-form" class="form-inline">
                                        <div class="input-group">
                                            <input type="text" name="searchName" th:value="${searchName}"
                                                   class="form-control">
                                            <span class="input-group-btn">
                                                <input class="btn btn-info" type="submit" value="名称搜索"><i
                                                    class="fa fa-search"></i></input>
                                            </span>
                                        </div>
                                    </form>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>

            </div>
            <div class="row med_bottompadder30">
                <div class="col-lg-9 col-md-9 col-sm-12 col-xs-12">
                    <!--                    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">-->
                    <div class="committee-title">
                        <h2>
                            <span>党政综合办公室</span>
                        </h2>
                    </div>
                    <div class="main-cont">
                        <div class="tab-content">
                            <div class="tab-pane active" id="cp01">
                                <div id="oc-kx" class="owl-carousel owl-theme">
                                    <div th:each="villageCommittee:${villageCommitteeList1}" class="item">
                                        <div class="cy-kx-post clearfix">
                                            <a th:href="@{/village/committeeDetailsUI(id=${villageCommittee.id})}">
                                                <div class="committee-image">
                                                    <img th:src="@{'/images/'+ ${villageCommittee.image} +'.jpg'}"
                                                         alt="Image" >
                                                </div>
                                                <div class="entry-content">
                                                    <li th:text="${villageCommittee.name}"></li>
                                                    <li th:text="${villageCommittee.position}" style="font-weight: bold; font-size: 18px"></li>
                                                </div>
                                            </a>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
                    <div class="sider-card">
                        <div class="sider-card-header">
                            <h3>办事指南</h3>
                        </div>
                        <ul class="sider-list-model-a">
                            <li th:each="activities:${topActivities1}">
                                <a th:href="@{/village/activitiesDetailsUI(id=${activities.id})}" th:text="${activities.title}"></a>

                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="row med_bottompadder30">
                <div class="col-lg-9 col-md-9 col-sm-12 col-xs-12">
                    <!--                    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">-->
                    <div class="committee-title">
                        <h2>
                            <span>党建工作办公室</span>
                        </h2>
                    </div>
                    <div class="main-cont">
                        <div class="tab-content">
                            <div class="tab-pane active" id="cp02">
                                <div id="oc-kx2" class="owl-carousel owl-theme">
                                    <div th:each="villageCommittee:${villageCommitteeList2}" class="item">
                                        <div class="cy-kx-post clearfix">
                                            <a th:href="@{/village/committeeDetailsUI(id=${villageCommittee.id})}">
                                                <div class="committee-image">
                                                    <img th:src="@{'/images/'+ ${villageCommittee.image} +'.jpg'}"
                                                         alt="Image" >
                                                </div>
                                                <div class="entry-content">
                                                    <li th:text="${villageCommittee.name}"></li>
                                                    <li th:text="${villageCommittee.position}" style="font-weight: bold; font-size: 18px"></li>
                                                </div>
                                            </a>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
                    <div class="sider-card">
                        <div class="sider-card-header">
                            <h3>政策法规</h3>
                        </div>
                        <ul class="sider-list-model-a">
                            <li th:each="activities:${topActivities2}">
                                <a th:href="@{/village/activitiesDetailsUI(id=${activities.id})}" th:text="${activities.title}"></a>

                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="row med_bottompadder30">
                <div class="col-lg-9 col-md-9 col-sm-12 col-xs-12">
                    <!--                    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">-->
                    <div class="committee-title">
                        <h2>
                            <span>人大办公室</span>
                        </h2>
                    </div>
                    <div class="main-cont">
                        <div class="tab-content">
                            <div class="tab-pane active" id="cp03">
                                <div id="oc-kx3" class="owl-carousel owl-theme">
                                    <div th:each="villageCommittee:${villageCommitteeList3}" class="item">
                                        <div class="cy-kx-post clearfix">
                                            <a th:href="@{/village/committeeDetailsUI(id=${villageCommittee.id})}">
                                                <div class="committee-image">
                                                    <img th:src="@{'/images/'+ ${villageCommittee.image} +'.jpg'}"
                                                         alt="Image" >
                                                </div>
                                                <div class="entry-content">
                                                    <li th:text="${villageCommittee.name}"></li>
                                                    <li th:text="${villageCommittee.position}" style="font-weight: bold; font-size: 18px"></li>
                                                </div>
                                            </a>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
                    <div class="sider-card">
                        <div class="sider-card-header">
                            <h3>乡政府办</h3>
                        </div>
                        <ul class="cy-contact">
                            <li><i class="fa fa-map-marker"></i> 办公地址：惠来县仙庵镇人民政府</li>
                            <!--                            <li><i class="fa fa-compass"></i> 邮编：515222</li>-->
                            <li><i class="fa fa-user"></i> 负责人：杨炳深</li>
                            <li><i class="fa fa-phone"></i> 办公电话：0663-6780003</li>
                            <li><i class="fa fa-clock-o"></i> 办公时间：工作日，8：30—12：00，14：00—17：30</li>

                        </ul>
                    </div>
                    <!--                    <div class="cy-title">-->
                    <!--                        <h2>乡政府办</h2>-->
                    <!--                    </div>-->
                    <!--                    <ul class="cy-contact">-->
                    <!--                        <li><i class="fa fa-map-marker"></i> 办公地址：惠来县仙庵镇人民政府</li>-->
                    <!--                        <li><i class="fa fa-compass"></i> 邮编：515222</li>-->
                    <!--                        <li><i class="fa fa-user"></i> 负责人：杨炳深</li>-->
                    <!--                        <li><i class="fa fa-phone"></i> 办公电话：0663-6780003</li>-->
                    <!--                        <li><i class="fa fa-clock-o"></i> 办公时间：周一至周五，8：30—12：00，14：00—17：30（节假日除外）</li>-->
                    <!--                    </ul>-->
                </div>
            </div>
            <div class="row med_bottompadder30">
                <div class="col-lg-9 col-md-9 col-sm-12 col-xs-12">
                    <!--                    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">-->
                    <div class="committee-title">
                        <h2>
                            <span>纪检监察办公室</span>
                        </h2>
                    </div>
                    <div class="main-cont">
                        <div class="tab-content">
                            <div class="tab-pane active" id="cp04">
                                <div id="oc-kx4" class="owl-carousel owl-theme">
                                    <div th:each="villageCommittee:${villageCommitteeList4}" class="item">
                                        <div class="cy-kx-post clearfix">
                                            <a th:href="@{/village/committeeDetailsUI(id=${villageCommittee.id})}">
                                                <div class="committee-image">
                                                    <img th:src="@{'/images/'+ ${villageCommittee.image} +'.jpg'}"
                                                         alt="Image" >
                                                </div>
                                                <div class="entry-content">
                                                    <li th:text="${villageCommittee.name}"></li>
                                                    <li th:text="${villageCommittee.position}" style="font-weight: bold; font-size: 18px"></li>
                                                </div>
                                            </a>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script th:src="@{/js/jquery_min.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <script th:src="@{/js/wow.min.js}"></script>
    <script th:src="@{/js/custom.js}"></script>
    <script th:src="@{/plugins/slider-pro/js/jquery.sliderPro.min.js}"></script>
    <script th:src="@{/plugins/owlcarousel/js/owl.carousel.min.js}"></script>
    <script th:src="@{/layer/layer.js}"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#my-slider').sliderPro({
                arrows: true,
                waitForLayers: true,
                autoplay: false,
                fade: true,
                buttons: false,
                autoScaleLayers: false,
                width: 1170,
                height: 400
            });
            $('.image_fade').hover(function () {
                $(this).filter(':not(:animated)').animate({opacity: 0.8}, 400);
            }, function () {
                $(this).animate({opacity: 1}, 400);
            });
            $("#oc-news").owlCarousel({
                margin: 30,
                nav: true,
                loop: true,
                // autoplay:true,
                // autoplayTimeout:6000,
                // autoplayHoverPause: true,
                dots: false,
                navText: ['<i class="fa fa-angle-left"></i>', '<i class="fa fa-angle-right"></i>'],
                responsive: {
                    0: {items: 1},
                    480: {items: 2},
                    768: {items: 3},
                    992: {items: 4}

                }
            });
            $("#oc-kx").owlCarousel({
                margin: 15,
                nav: true,
                loop: true,
                // autoplay:true,
                // autoplayTimeout:5000,
                // autoplayHoverPause: true,
                dots: false,
                navText: ['<i class="fa fa-angle-left"></i>', '<i class="fa fa-angle-right"></i>'],
                responsive: {
                    0: {items: 1},
                    240: {items: 2},
                    480: {items: 3},
                    720: {items: 4},
                    960: {items: 5},
                }
            });

            $("#oc-kx2").owlCarousel({
                margin: 15,
                nav: true,
                loop: true,
                // autoplay:true,
                // autoplayTimeout:5000,
                // autoplayHoverPause: true,
                dots: false,
                navText: ['<i class="fa fa-angle-left"></i>', '<i class="fa fa-angle-right"></i>'],
                responsive: {
                    0: {items: 1},
                    240: {items: 2},
                    480: {items: 3},
                    720: {items: 4},
                    960: {items: 5},
                }
            });

            $("#oc-kx3").owlCarousel({
                margin: 15,
                nav: true,
                loop: true,
                // autoplay:true,
                // autoplayTimeout:5000,
                // autoplayHoverPause: true,
                dots: false,
                navText: ['<i class="fa fa-angle-left"></i>', '<i class="fa fa-angle-right"></i>'],
                responsive: {
                    0: {items: 1},
                    240: {items: 2},
                    480: {items: 3},
                    720: {items: 4},
                    960: {items: 5},
                }
            });
            $("#oc-kx4").owlCarousel({
                margin: 15,
                nav: true,
                loop: true,
                // autoplay:true,
                // autoplayTimeout:5000,
                // autoplayHoverPause: true,
                dots: false,
                navText: ['<i class="fa fa-angle-left"></i>', '<i class="fa fa-angle-right"></i>'],
                responsive: {
                    0: {items: 1},
                    240: {items: 2},
                    480: {items: 3},
                    720: {items: 4},
                    960: {items: 5},
                }
            });
            // setInterval(function () {
            //     var buy = $('.sp-previous-arrow')[0];//给你的a标签加一个id :btnBuy
            //     buy.click();
            // }, 5000)//后面的500是以毫秒为单位。
        });
    </script>
</div>
</html>